<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- <canvas style="border: 1px solid black;" id="myCanvas" width="1000" height="1000"></canvas>
    <script>
        let ctx = document.getElementById("myCanvas").getContext("2d");;
    </script> -->
    <canvas style="border: 1px solid black;" id="myCanvas" width="1000" height="1000"></canvas>
    <script>
        let ctx = document.getElementById("myCanvas").getContext("2d");
        // round, bevel, miter为圆角，斜角，尖角
        ctx.lineJoin = "round";
        // butt,round, square为默认方形，圆形，方形
        ctx.lineCap = "round";
        ctx.lineWidth = 10;
        // miterLimit为斜角长度限制
        ctx.miterLimit = 10;
    </script>
</body>

</html>